<template>
  <div
    class="m-read-more-bar"
    :class="{ 'u-collapsed': collapsed }"
  >
      <el-icon class="u-angle">
        <ArrowUp />
      </el-icon>
  </div>
</template>

<script setup name="MReadMoreBar">
defineProps({
  collapsed: Boolean,
})
</script>

<style lang="stylus" scoped>
.m-read-more-bar
  &.u-collapsed
    .u-angle
      transform rotate(180deg)
  .u-angle
    display block
    margin 0 auto
    width: 16px;
    height: 16px;
    background-size 100%
    transition all .3s
    cursor pointer
</style>
